<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <th:block th:include="include :: header('新增来电记录')"/>
</head>
<style>
    label {
        font-weight: bold;
    }

    @font-face {
        font-family: 'huawen';
        src: url("/fonts/huawen.woff2");
    }

    .label-boxb {
        margin-top: 20px;
    }

    .lable-page-icon {
        color: #ccc;
        position: absolute;
        top: 7px;
        right: 20px;
    }

    .lable-page-icon:hover {
        cursor: pointer
    }
</style>
<body style="background-color: #ffff;letter-spacing:2px;font-family:'huawen' ;font-weight: bold">
<form id="form-user-add" class="form-horizontal" style="background-color: #ffff">
    <div id="ads">
        <div>
            <a href="#" onclick="snrFindCdtnShow()">查看条件</a>
            <a href="#" onclick="snrCdtnClear()">清空条件</a>
        </div>
        <div id="dlg_Setbar" style="margin-bottom:10px;">
            <span class="spLBlue">点击这里增加条件设置：</span>
            <a href="" class="btn btn-primary glyphicon glyphicon-plus" role="button"
               title="增加条件" onClick="snrAddCd(cdtnsSnr);"></a>
        </div>
        <div id="cdtnCell">
            <table id="tabSnrCdtn" cellspacing="1" cellpadding="1" width="98%" border="0">
                <tr>
                    <td><select name="cdnField" class="form-control formSelect">
                        <option value="WsCode">流水号</option>
                        <option value="WorkFormNO">工单编号</option>
                        <option value="SetProName">工单性质</option>
                        <option value="FromTel">来电号码</option>
                        <option value="FromName">来电人名</option>
                        <option value="FmAreaName">所属地区</option>
                        <option value="IptWorker">派单人</option>
                    </select></td>
                    <td><select name="cdnOper" class="form-control formSelect">
                        <option value="201">包含</option>
                        <option value="101">等于</option>
                        <option value="202">不包括</option>
                        <option value="102">不等于</option>
                        <option value="120">大于</option>
                        <option value="110">小于</option>
                    </select></td>
                    <td><select name="cdnCnt" class="form-control formSelect">
                        <option value="and">并且</option>
                        <option value="or">或者</option>
                    </select></td>
                    <td align="left"><input name="cdnKey" class="form-control" type="text" maxlength="30"></td>
                    <td><a href="#" class="btn btn-danger glyphicon glyphicon-minus" role="button" title="移除此条件"
                           onclick="snrRemoveCdtn(this)" alt="移除此条件"></a></td>
                </tr>
            </table>
        </div>
    </div>
</form>
</body>
<th:block th:include="include :: footer"/>
<script>
    var cdtnsSnr = [{
        field: 'WsCode',
        showText: '流水号'
    }, {
        field: 'WorkFormNO',
        showText: '工单编号'
    }, {
        field: 'SetProName',
        showText: '工单性质'
    }, {
        field: 'FromTel',
        showText: '来电号码'
    }, {
        field: 'FromName',
        showText: '来电人名'
    }, {
        field: 'FmAreaName',
        showText: '所属地区'
    }, {
        field: 'IptWorker',
        showText: '派单人'
    }];

    function snrAddCd(fpJson) {
        var tabObj = document.getElementById("tabSnrCdtn");
        var tRs = tabObj.rows.length;
        var nwRw = tabObj.insertRow(tRs);
        var clA = nwRw.insertCell(0);
        var clB = nwRw.insertCell(1);
        var clC = nwRw.insertCell(2);
        var clD = nwRw.insertCell(3);
        var clE = nwRw.insertCell(4);

        var fldNames = ""; //fldPro(1=string,2=number,3=datetime)
        $.each(fpJson, function (i, n) {
            fldNames += '<option value="' + n.field + '">' + n.showText + '</option>';
        });
        clA.innerHTML = "<select name=\"cdnField\" class=\"form-control formSelect\">" + fldNames + "</select>";
        // clA.height = "28";

        var opStr = '<select name="cdnOper"  class="form-control formSelect"><option value="201">包含</option><option value="101">等于</option><option value="202">不包括</option><option value="102">不等于</option><option value="120">大于</option><option value="110">小于</option></select>';
        clB.innerHTML = opStr;


        var cntDdl = '<select name="cdnCnt" class="form-control formSelect"><option value="and">并且</option><option value="or">或者</option></select>';
        clC.innerHTML = cntDdl;

        var keyIpt = '<input name="cdnKey" class="form-control" type="text" maxlength="30"  />';
        clD.innerHTML = keyIpt;
        clD.align = "left";

        var rmvBtn = '<a href="#" class="btn btn-danger glyphicon glyphicon-minus" role="button"  title="移除此条件" onClick="snrRemoveCdtn(this)" alt="移除此条件" />';
        clE.innerHTML = rmvBtn;

    }

    function snrRemoveCdtn(e) {
        var rIdx = e.parentNode.parentNode.rowIndex;
        //alert(rIdx);
        document.getElementById("tabSnrCdtn").deleteRow(rIdx);
    }

    //    关闭
    function gclose() {
        $.modal.close();
    }

    var prefix = ctx + "system/lookup";

    function submitHandler() {
        let data = $('#form-user-add').serializeArray();
        var tabObj = document.getElementById("tabSnrCdtn");
        var tRs = tabObj.rows.length;
        var showStr = 'goto Search';
        var canSch = false;

        if (tRs < 1) {
            showStr = '<span class="f14 spLRed">您没有设置任何条件！</span>';
            $.modal.alert(showStr);
            return false;
        } else {
            showStr = '<span class="f14 spLRed">您没有设置有效的查询条件！</span>';
            for (var i = 0; i < tRs; i++) {
                var objCnt = tabObj.rows[i].cells[3].childNodes[0];
                var tmpKey = objCnt.value.trim();
                if (tmpKey.length > 0) {
                    canSch = true;
                }
            }
        }
        if (canSch) {
            var config = {
                url: prefix + "/mailWFList",
                type: "post",
                dataType: "json",
                data: data,
                success: function (result) {
                    // $.operate.successCallback(result);
                    f(result);
                }
            };
            $.ajax(config);
        } else {
            $.modal.alert(showStr)
        }
    }
    function f(result) {
        return result
    }

    function snrCdtnClear() {
        var tabObj = document.getElementById("tabSnrCdtn");
        var tRs = tabObj.rows.length;
        for (var i = 0; i < tRs - 1; i++) {
            tabObj.deleteRow(0);
        }
    }

    function snrFindCdtnShow() {
        var tabObj = document.getElementById("tabSnrCdtn");
        var tRs = tabObj.rows.length;
        var showStr = 'the condition';
        if (tRs < 1) {
            showStr = '<span class="f14 spLRed">系统提示：您没有设置任何条件！</span>';
            $.modal.alert(showStr);
        } else {
            showStr = "";
            for (var i = 0; i < tRs; i++) {
                var objFld = tabObj.rows[i].cells[0].childNodes[0];
                var objOP = tabObj.rows[i].cells[1].childNodes[0];
                var objKey = tabObj.rows[i].cells[2].childNodes[0];
                var objCnt = tabObj.rows[i].cells[3].childNodes[0];
                showStr += objFld.options[objFld.selectedIndex].text + " <span class='spRed'>" + objOP.options[objOP.selectedIndex].text + "</span> <span class='spLBlue'>" + objKey.options[objKey.selectedIndex].text + "</span> <span class='spOrange'>" + objCnt.value + "</span><br/><br/>";
            }
            $.modal.alert(showStr);
        }
    }
</script>
</html>